<!-- <text class="title">{{title}}111</text> -->
<template>
	<view class="shop">
		<!-- <uni-section class="shop-hd uni-center uni-bg-gray" titleColor="#111" titleFontSize="44rpx" :title="toptitle"></uni-section> -->
		<view>
			<!-- <view class="">
				<uni-datetime-picker type="date" :border="false" :clear-icon="false"
				v-model="datetemp" @maskClick="maskClick" @change="datechange" style="padding: 10px 10px;"/>
			</view> -->
			<view class="uni-flex uni-row uni-form-item cus-parallel-titles" v-if="typeid == 1">
				<uni-section class="cus-parallel-tit uni-center" :title="numtostr(dailyflowresdata.recharge_money)" 
				titleFontSize="44rpx" titleColor="#111"
				sub-title="总充值(元)" subTitleFontSize="24rpx" subTitleColor="#999"></uni-section>
				
				<uni-section class="cus-parallel-tit uni-center" :title="numtostr(dailyflowresdata.recharge_score)" titleFontSize="44rpx" titleColor="#111"
				sub-title="总送兑换金(元)" subTitleFontSize="24rpx" subTitleColor="#999"></uni-section>
			</view>
			<view class="uni-flex uni-row uni-form-item cus-parallel-titles" v-if="typeid == 2">
				<uni-section class="cus-parallel-tit uni-center" :title="numtostr(dailyflowresdata.total)" 
				titleFontSize="44rpx" titleColor="#111"
				sub-title="总笔数(元)" subTitleFontSize="24rpx" subTitleColor="#999"></uni-section>
				<uni-section class="cus-parallel-tit uni-center" :title="numtostr(dailyflowresdata.sum)" 
				titleFontSize="44rpx" titleColor="#111"
				sub-title="实付总消费(元)" subTitleFontSize="24rpx" subTitleColor="#999"></uni-section>
			</view>
			<scroll-view
			            class="dialogue-box"
			            style="height: 65vh"
			            :scroll-y="true"
			            :refresher-threshold="10"
			            :scroll-top="scrollTop"
			            @scrolltolower="handelLower"
			            :refresher-enabled="isLoadingTop"
			            :refresher-triggered="isTriggeredTop"
			            @refresherrefresh="handleRefresher"
			            @refresherrestore="handelonRestore"
			          >
				<view class="weui-form-preview" v-for="(item,index) in listarr" :key="index">
					
						<!-- <template v-slot:right>
							<text>{{item.realname}}</text>
						</template> -->
						<view class="weui-form-preview__bd">
							<!-- <view class="weui-form-preview__item">
								<text class="weui-form-preview__label">姓名</text>
								<text class="weui-form-preview__value">{{item.realname}}</text>
							</view> -->
							<!-- <view class="weui-form-preview__item">
								<text class="weui-form-preview__label">电话</text>
								<text class="weui-form-preview__value">{{item.mobile}}</text>
							</view> -->
							<view class="weui-form-preview__item">
								<text class="weui-form-preview__label">实付金额(元)</text>
								<text class="weui-form-preview__value">{{item.money}}</text>
							</view>
							<view class="weui-form-preview__item">
								<text class="weui-form-preview__label">兑换金额(元)</text>
								<text class="weui-form-preview__value">{{item.score}}</text>
							</view>
							<!-- <view class="weui-form-preview__item" v-if="typeid == 1">
								<text class="weui-form-preview__label">送卡名称</text>
								<text class="weui-form-preview__value">{{item.card_name}}</text>
							</view> -->
							<view class="weui-form-preview__item">
								<text class="weui-form-preview__label">结算时间</text>
								<text class="weui-form-preview__value">{{newdate(item.createtime)}}</text>
							</view>
						</view>			
					
				</view>
				<uni-load-more :status="status"/>
			</scroll-view>
			
		</view>
		
	</view>
</template>

<script>
	// 
	import {shopemployeeflow,userrecharge_record,userconsumption_record} from "@/api/apiinfo";
	import {timestampToTemplatethoer} from "@/utils/validate.js"
	export default {
				components: {},
				data() {
					return {
						status: 'more',//more/loading/noMore
						
						// statusTypes: [{
						// 	value: 'more',
						// 	text: '加载前',
						// 	checked: true
						// }, {
						// 	value: 'loading',
						// 	text: '加载中',
						// 	checked: false
						// }, {
						// 	value: 'noMore',
						// 	text: '没有更多',
						// 	checked: false
						// }],
						
						
						toptitle:'',
						scrollTop: "50px",
						isLoadingTop: true,
						isTriggeredTop: true,
						typeid:1,
						pagenumber:1,
						listarr:[],//列表
						
						shop_id:0,
						dailyflowresdata:{} ,//获取到的所有数据
						getdate:'',
						datetemp:'',
						
					}
				},
				mounted() {
					// setTimeout(() => {
					// 	this.datetemp = timestampToTemplatethoer(Date.now());
					// },1000)
					// console.log(timestampToTemplate(Date.now()))
				},
				onLoad() {
					console.log(this.$route.query.shop_id)
					this.shop_id = this.$route.query.shop_id
					this.typeid = this.$route.query.typeid
					
					if(this.typeid == 1){
						this.toptitle = "充值流水" //userrecharge_record
						this.getuserrecharge_record()
						
					}else{
						this.toptitle = "消费流水" //userconsumption_record
						this.getuserconsumption_record();
					}
				},
				methods: {
					newdate(times){//时间戳转换时间格式
						return timestampToTemplatethoer(times * 1000)
					},
					// datechange(e){
						
					// 	this.getdate = e
					// 	this.getshopemployeeflow();
					// },
					numtostr(num){
						// console.log(num)
						if(num<=0 || num=='' || num === undefined){
							return '0'
						}else{
							return num.toString()
						}
						
					},
					handelLower() {
					  console.log("滚动到底部>>>");
					  if (this.status == "loading") return;
					  if (!this.status == "noMore") return;
					  
					  this.pagenumber += 1;
					  
					  if(this.typeid == 1){
					  	this.getuserrecharge_record(true)
					  	
					  }else{
					  	this.getuserconsumption_record(true);
					  }
					},
					handleRefresher() {
					  console.log("顶部下拉刷新s>>>", this.isLoadingTop, this.isTriggeredTop);
					  this.isLoadingTop = true;
					  this.isTriggeredTop = true;
					  if (!this.isLoadingTop) return;
					  
					  if(this.typeid == 1){
					  	this.getuserrecharge_record()
					  	
					  }else{
					  	this.getuserconsumption_record();
					  }
					  this.isLoadingTop = false;
					  this.isTriggeredTop = false;
					},
					handelonRestore() {
					  console.log("handelonRestore>>>");
					  this.isLoadingTop = true;
					},
					getuserrecharge_record(load) { //获取自己在指定商店的消费流水 
						console.log('当前页：'+this.pagenumber)
						this.status = 'loading'
						
						userrecharge_record(this.shop_id,this.pagenumber).then((res) => {
							// console.log("接口返回数据：")
							// console.log(JSON.stringify(res));
							// this.listtotal = res.data.total.toString();
							this.dailyflowresdata = res.data
							if(load){
								if (res.data.list && res.data.list.length == 0) {
									uni.hideLoading();
									uni.showToast({
										title: '没有更多了',
										duration: 1500
									});
									this.status = 'noMore'
									this.pagenumber -= 1;
								} else {
									this.listarr = this.listarr.concat(res.data.list);
									uni.hideLoading();
									this.status = 'more'
								}
							}else{
								if(res.data.list.length >=1){
									this.listarr = res.data.list
									this.status = 'more'
								}else{
									this.status = 'noMore'
								}
							}
						}).catch(err => {
							console.log(JSON.stringify(err))
							this.status = 'noMore'
							if(err.msg){
								uni.showModal({
									title: '提示',
									content: '数据接口报错1：'+err.msg,
									showCancel: false,
									success: function (res) {
										if (res.confirm) {
											// uni.switchTab({ //内部页面跳转方式 
											// 	url: '/pages/shop/shop'
											// })
										} 
									}
								});
							}else{
								this.status = 'noMore'
								console.log('catch err')
							}
							
						})
					},
					getuserconsumption_record(load) { //获取自己在指定商店的消费流水
						console.log('当前页：'+this.pagenumber)
						this.status = 'loading'
						
						userconsumption_record(this.shop_id,this.pagenumber).then((res) => {
							console.log("接口返回数据：")
							console.log(JSON.stringify(res));
							// this.listtotal = res.data.total.toString();
							this.dailyflowresdata = res.data
							if(load){
								if (res.data.list && res.data.list.length == 0) {
									uni.hideLoading();
									uni.showToast({
										title: '没有更多了',
										duration: 1500
									});
									this.status = 'noMore'
									this.pagenumber -= 1;
								} else {
									this.listarr = this.listarr.concat(res.data.list);
									uni.hideLoading();
									this.status = 'more'
								}
							}else{
								if(res.data.list.length >=1){
									this.listarr = res.data.list
									this.status = 'more'
								}else{
									this.status = 'noMore'
								}
							}
						}).catch(err => {
							console.log(JSON.stringify(err))
							this.status = 'noMore'
							if(err.msg){
								uni.showModal({
									title: '提示',
									content: '数据接口报错1：'+err.msg,
									showCancel: false,
									success: function (res) {
										if (res.confirm) {
											// uni.switchTab({ //内部页面跳转方式 
											// 	url: '/pages/shop/shop'
											// })
										} 
									}
								});
							}else{
								this.status = 'noMore'
								console.log('catch err')
							}
							
						})
					},
					clickLoadMore(e) {
						uni.showToast({
							icon: 'none',
							title: "当前状态：" + e.detail.status
						})
					}
				}
			}
</script>



<style lang="scss">
	.weui-form-preview__label{
		width: 280rpx;
	}
	.uni-section{
		border-bottom: 2rpx solid rgba(0, 0, 0, .1);
		background-color: transparent;
	}
	/* .shop .cus-parallel-titles .cus-parallel-tit::before {
	    position: absolute;
	    background-color: rgba(0, 0, 0, 0.1);
	    content: "";
	    width: 1px;
	    top: 10px;
	    bottom: 10px;
	    right: 0;
	} */
	// @media (prefers-color-scheme: dark){
	// 	.dialogue-box{}
	// }
</style>